{namespace mitel.presto.widget}

/**
 * Build the base UI for presto
 */
{template .ui}

   <textarea id="callbox" style="width:140px" class="{css presto_callbox}">Mitel UCC</textarea>
   <div id="presence" class="{css presto_presence}"></div>
   <span>
   <input id="call_button" type="button" class="{css presto_call_button}" value=" Call ">   
   </span>
   
   <span>
   <form id="presence1" class="{css presto_select}">
      <label class="presto_radio"><input type="radio" name="In_Out" id="radio_out" value="away">Away</label>
      <label class="presto_radio"><input type="radio" name="In_Out" id="radio_in" value="in_office" checked>In office</label>
   </form>
   </span>

   <select id="actions" class="{css presto_select}">
      <option>Select an action</option>
      <option value="ClearCall">Hang up</option>
      <option value="HoldCall">Hold</option>
      <option value="RetrieveCall">Retrieve</option>
      <option value="ConferenceCall">Conference</option>
      <option value="TransferCall">Transfer</option>
      <option value="AlternateCall">Alternate</option>
   </select>

   <div id="main">
      main
   </div>

   <div id="status" class="{css presto_status}"></div>
   
   <div id="request" class="{css presto_request}"></div>

   <div id="callprompt" class="{css presto_call_prompt}">
      <a href="javascript:void(0);" id="voice">Voice</a> | Chat | <a href="javascript:void(0);" id="video">Video</a>
      <div id="prompttext" class="{css presto_prompttext}"/>
   </div>
   
   <div id="drop_target" class="{css presto_drop_target}">
      Drop Phone numbers and/or names here
   </div>
{/template}

/**
 * Make a call selector
 * @param people List of people and phone numbers
 */
{template .make_call}
   <select id="userSelect" class="{css presto_select}">
      <option>Make a call</option>
      {foreach $person in $people}
      <option value="{$person.number}">{$person.name}@{$person.number}</option>
      {/foreach} 
   </select>
{/template}

/**
 * The prompt call widget
 * @param entries List of entries
 */
{template .prompt_call}
   <ul class="{css presto_call_numbers}">
      {foreach $entry in $entries}
      <li>{$entry.contact}</li>
      {/foreach}
   </ul>
{/template}

/**
 * @param device User's phone device
 * @param callParty Call Party
 * @param dn DN
 * @param stateHumanReadable Human readable device state
 */
{template .status}
   {if $device}
      <br />
      {$dn} - {$stateHumanReadable}
      {if $callParty} - {$callParty}
      {/if}
   {/if}
{/template}
